<template>
  <div>
    <div>
      <el-table :data="blogList.list" strip border>
        <el-table-column prop="postId" label="序号" width="70" align="center" sortable />
        <el-table-column prop="postTitle" label="标题" width="150" align="center" sortable />
        <el-table-column label="封面" width="200" align="center" sortable>
          <template slot-scope="scope">
            <video v-if="isVideo(scope.row.postPhoto)" :src="scope.row.postPhoto" alt="图片" width="100" height="100" controls />
            <img v-else :src="scope.row.postPhoto" alt="图片" width="100" height="100">
          </template>
        </el-table-column>
        <el-table-column label="操作 " align="center" width="180">
          <template v-slot="scope">
            <el-button size="mini" type="primary" plain @click="handleEdit(scope.row)">详情</el-button><br>
            <el-button size="mini" type="danger" plain @click="del(scope.row.postId,0)">审核通过</el-button><br>
            <el-button size="mini" type="danger" plain @click="del(scope.row.postId,1)">审核不通过</el-button>
          </template>
        </el-table-column>
        <el-table-column label="原因" width="100" align="center" sortable>
          <template slot-scope="scope">
            {{ scope.row.examine===0 ? '未审核' : '被举报' }}
          </template>
        </el-table-column>

      </el-table>
      <div class="pagination">
        <el-pagination
          background
          :current-page="pageNum"
          :page-sizes="[5, 10, 20]"
          :page-size="pageSize"
          layout="total, prev, pager, next"
          :total="total"
          @current-change="handleCurrentChange"
        />
      </div>
    </div>
    <el-dialog :data="theblogList" title="博客信息" :visible.sync="fromVisible" width="40%" :close-on-click-modal="false" destroy-on-close>
      <div>
        <label for="title">标题:</label>
        <span>{{ theblogList.postTitle }}</span>
      </div>
      <div>
        <label for="title">内容:</label>
        <span>{{ theblogList.postContent }}</span>
      </div>
      <div>
        <label for="title">封面:</label><br>
        <span>
          <video v-if="isVideo(theblogList.postPhoto)" :src="theblogList.postPhoto" alt="图片" width="200" controls />
          <img v-else :src="theblogList.postPhoto" style="width: 200px">
        </span>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="fromVisible = false">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getAction, putAction } from '@/utils/xhs-ajax'

export default {
  data() {
    return {
      pageNum: 1,
      pageSize: 5,
      total: 0,
      blogList: [],
      judge: '',
      theblogList: [],
      fromVisible: false
    }
  },
  created() {
    this.fetchBlogList()
  },
  methods: {
    isVideo(file) {
      if (!file) return false // 确保 file 不为空
      const ext = file.split('.').pop().toLowerCase()
      return ['mp4', 'avi', 'mov'].includes(ext)
    },
    fetchBlogList() {
      getAction('/administrators/checkExamine.do').then(res => {
        this.blogList = res.data
        this.total = res.data.total
        console.log(res.data.list)
      })
    },
    handleCurrentChange(pageNum) {
      getAction('/administrators/checkExamine.do?pageNum=' + pageNum).then(res => {
        this.blogList = res.data
        this.total = res.data.total
      })
    },
    del(id, judge) {
      console.log(id)
      putAction('/administrators/examine.do?postId=' + id + '&judge=' + judge)
      this.fetchBlogList()
    },
    handleEdit(rowlist) {
      this.fromVisible = true// 打开弹窗
      this.theblogList = rowlist
    }
  }
}
</script>
<style scoped lang="scss">

</style>
